<template>
  <div class="waitplay">
    <Slide :Slides="MostExpected" />
    <div class="waitlist">
      <Card :CardList="ComingList" />
    </div>
  </div>
</template>
<script>
import Slide from '@/components/home/Slide'
import Card from '@/components/home/Card'
export default {
  data () {
    return {
      MostExpected: [],
      ComingList: []
    }
  },
  components: {
    Slide,
    Card
  },
  created () {
    this.getMostExpected()
    this.getComingList()
  },
  methods: {
    async getMostExpected () {
      const res = await this.$http.getMostExpected()
      console.log(res)
      this.MostExpected = res.data.coming
    },
    async getComingList () {
      const res = await this.$http.getComingList()
      console.log(res)
      this.ComingList = res.data.coming
    }
  }
}
</script>
<style lang="scss" scoped>
</style>
